<template>
  <div class="wrap">
    <div class="left">
      <!-- <FormPanel
        ref="formPanel"
        :list="formList"
        :cols="1"
        :labelWidth="110"
        formType="add"
        :isSubmitBtn="false"
        @formChange="formChangeHandle"
      />
      <el-button @click="query" type="primary" :loading="addBtnState">查询</el-button>-->
      <div class="box">
        <TopFilter ref="formPanel" :list="formList" :cols="1" :labelWidth="110" :collapse="false" @filterChange="formChangeHandle" @onCollapse="collapseHandle" />
      </div>
      <FilterTable
        ref="table"
        :columns="columns"
        :fetchapi="fetchApi"
        :height="380"
        :params="fetchParams"
        selectionType="single"
        :isColumnFilter="false"
        :isToperInfo="false"
        :isPagination="false"
        :datakey="'rows'"
        :onRowSelectChange="selectChangeHandle"
        :onColumnsChange="columns => (this.columns = columns)"
      ></FilterTable>
    </div>

    <div class="right">
      <FilterTable
        ref="table1"
        :columns="columnsR1"
        :height="260"
        :isColumnFilter="false"
        :isToperInfo="false"
        :isSelectColumn="false"
        :dataSource="list1"
        :onColumnsChange="columns => (this.columnsR1 = columns)"
      ></FilterTable>
      <FilterTable
        ref="table2"
        :columns="columnsR2"
        :isSelectColumn="false"
        :isColumnFilter="false"
        :isToperInfo="false"
        :dataSource="list2"
        :onColumnsChange="columns => (this.columnsR2 = columns)"
      ></FilterTable>
    </div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 99,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDialog">取 消</el-button>
      <el-button type="primary" @click="saveDialog">确 定</el-button>
    </div>
  </div>
</template>
<script>
import { getWxzhZxList, getWxzhYsList, getWxzhYxList } from '@/api/repair/business/customer/activity.js';
import { dictionary } from '@/utils/dictMixin';
export default {
  name: 'Repcombination',
  mixins: [dictionary],
  props: ['repirlist'],
  data() {
    // this.BaseTable = null;
    return {
      fetchApi: getWxzhZxList,
      fetchParams: { xhrAbort: false },
      columns: this.createTableColumns(),
      // 右侧teble1
      list1: [],
      columnsR1: this.createTableColumnsR1(),
      // 右侧teble2
      list2: [],
      columnsR2: this.createTableColumnsR2(),
      formList: this.createFormList(),
      parmes: {
        list1: '',
        list2: ''
      }
      // selectList:{},
      // flag:''
    };
  },
  methods: {
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '组合代码',
          fieldName: 'searchCode',
          placeholder: ''
          // rules: [{ required: true, message: '请输入角色代码', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '组合名称',
          fieldName: 'searchPackage',
          placeholder: ''
          // rules: [{ required: true, message: '请输入角色名称', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '是否OEM组合',
          fieldName: 'isOem',
          placeholder: '请选择',
          itemList: this.createDictList('1278')
          // rules: [{ required: true, message: '请输入角色名称', trigger: 'blur' }]
        }
      ];
    },
    formChangeHandle(val) {
      this.fetchParams = Object.assign({}, val, { xhrAbort: false });
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '已添加',
          dataIndex: 'IS_SELECT',
          sorter: true,
          render: props => {
            let val = props.row.IS_SELECT === '1' ? true : false;
            return <el-radio value={val} onInput={val => (props.row.IS_SELECT = val ? '1' : '0')}></el-radio>;
          }
        },
        {
          title: '组合代码',
          dataIndex: 'PACKAGE_CODE',
          sorter: true
        },
        {
          title: '组合类别',
          dataIndex: 'PACKAGE_TYPE_NAME',
          sorter: true
        },
        {
          title: '组合名称',
          dataIndex: 'PACKAGE_NAME',
          sorter: true
        }
      ];
    },
    createTableColumnsR1() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '项目代码',
          dataIndex: 'LABOUR_CODEF',
          sorter: true
        },
        {
          title: '项目名称',
          dataIndex: 'LABOUR_NAME',
          sorter: true
        },
        {
          title: '项目维修类型',
          dataIndex: 'REPAIR_TYPE_NAME',
          sorter: true
        },
        {
          title: '标准工时',
          dataIndex: 'STD_LABOUR_HOUR',
          sorter: true
        },
        {
          title: '派工工时',
          dataIndex: 'ASSIGN_LABOUR_HOUR',
          sorter: true
        },
        {
          title: '索赔工时',
          dataIndex: 'CLAIM_LABOUR',
          sorter: true
        }
      ];
    },
    createTableColumnsR2() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '仓库代码',
          dataIndex: 'STORAGE_CODE',
          sorter: true
        },
        {
          title: '备件代码',
          dataIndex: 'PART_NO',
          sorter: true
        },
        {
          title: '备件名称',
          dataIndex: 'PART_NAME',
          sorter: true
        },
        {
          title: '备件数量',
          dataIndex: 'PART_QUANTITY',
          sorter: true
        },
        {
          title: '备件销售单价',
          dataIndex: 'PART_SALES_PRICE',
          sorter: true
        },
        {
          title: '备件销售金额',
          dataIndex: 'PART_SALES_AMOUNT',
          sorter: true
        },
        {
          title: '可用库存',
          dataIndex: 'USEABLE_STOCK',
          sorter: true
        },
        {
          title: '车型组',
          dataIndex: 'PART_MODEL_GROUP_NAME',
          sorter: true
        },
        {
          title: '项目代码',
          dataIndex: 'LABOUR_CODE',
          sorter: true
        }
      ];
    },
    selectChangeHandle(rows) {
      if (!rows.length) {
        this.list1 = [];
        this.list2 = [];
        return;
      }
      this.getWxzhYsList(rows[0]);
      this.getWxzhYxList(rows[0]);
      this.selectList = rows[0];
      console.log('selectList', this.selectList);
    },
    async getWxzhYsList(row) {
      const res = await getWxzhYsList(row, { sort: 'LABOUR_CODE', order: 'asc', dmsFuncId: 35100010 });
      console.log('111', res);
      this.list1 = res;
      this.parmes.list1 = res;
    },
    async getWxzhYxList(row) {
      const res = await getWxzhYxList(row, { sort: 'PART_NO', order: 'asc', dmsFuncId: 35100010 });
      console.log('222', res);
      this.list2 = res;
      this.parmes.list2 = res;
    },
    closeDialog() {
      this.$emit('close', false);
    },
    saveDialog() {
      let flag = false;
      let reg = this.selectList.PACKAGE_CODE;
      let arr = [...this.repirlist];
      if (arr && arr.length > 0) {
        for (let i = 0; i < arr.length; i++) {
          if (arr[i].PACKAGE_CODE == reg) {
            flag = true;
            break;
          }
        }
      }
      if (flag) {
        this.$notify({
          // title: '警告',
          message: '不允许添加相同的维修组合！',
          type: 'warning'
        });
      } else {
        this.$emit('WxxmList', this.parmes);
        this.$confirm('维修组合新增成功，是否继续新增？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(() => {})
          .catch(() => {
            // this.$notify.info({title: '提示信息',message:'已取消删除'});
            this.closeDialog();
          });
      }

      console.log('维修组合124', reg);
      // if(flag){
      //    alert(1);
      // }else{
      //    this.$emit('WxxmList',this.parmes)
      // }
    }
  }
};
</script>
<style lang="less" scoped>
.wrap {
  display: flex;
  .left {
    width: 40%;
    .box {
      border: 1px solid #ccc;
      padding-top: 15px;
      padding-right: 15px;
      border-radius: @borderRadius;
      margin-bottom: 20px;
      box-shadow: @boxShadow;
    }
  }
  .right {
    // flex: 1;
    width: 59%;
    margin-left: 10px;
  }
}
</style>
